<template>
    <component
    is="a-modal"
    v-model:visible="visible"
    :width="800"
    :title="title"
    :mask-closable="false"
    :ok-loading="loading"
    @cancel="close">
        <div style="height: 420px">
            <iframe
                id="iframe"
                ref="iframeComponent"
                allowfullscreen="true"
                webkitallowfullscreen="true"
                mozallowfullscreen="true"
                :src="iframeUrl"
                width="100%"
                height="100%"
                frameborder="0"
            ></iframe>
        </div>
    </component>
</template>
<script setup lang="ts">
import API_LIVE from '@/api/live/live'
import { ref } from 'vue'
// const emit = defineEmits(['success', 'close'])

const visible = ref(false)
const title = ref('预览')
const close = () => {
    iframeUrl.value = ''
    visible.value = false
}
const url = 'https://e.vhall.com/v3/embed/media/preview'
const iframeUrl = ref('')
const loading = ref(false)

const open = async (video_id: number | string) => {
    visible.value = true
    const res = await API_LIVE.getVideoPreview({record_id:video_id})
    iframeUrl.value = res.data.preview_video_url
}

defineExpose({
    open
})
</script>
